import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

//实例化方法并导出
export default new Vuex.Store({
  state: {
    count:0,
    info:[
      {id:1, name:'潇潇1',age:20},
      {id:2, name:'潇潇2',age:11},
      {id:3, name:'潇潇3',age:18},
      {id:4, name:'潇潇4',age:33},
      {id:5, name:'潇潇5',age:14}
    ]
  },
  mutations: {
    increment(state,payload){
      //如果mutation是一个异步函数,那么devtools不能跟踪数据的变化
      // setTimeout(()=>{
      //   state.count+=payload;
      // },2000);
      //mutation负责同步修改状态
      state.count+=payload;
    }
  },
  //异步函数
  actions: {
    asyncIcrement(context,payload){
      setTimeout(() => {
          context.commit('increment',payload);
      },2000)
    }
  },
  getters: {//store的计算属性
    //计算数字的平方
    quadratic(state){
      //第一个参数 状态state
      return state.count*state.count
    },
    //筛选数据
    // filterInfo(state){
    //   return function(age){
    //     //age返回的不是一个不确定的值,而是一个函数
    //     return state.info.filter(res => {
    //       return res.age > age;
    //     })
    //   }
    // }
    //筛选数据
    filterInfo(state){
      //age返回的不是一个不确定的值,而是一个函数
      return (age) => {
        return state.info.filter(res => res.age > age)
      }    
    },
    testGetters(state,getters){
      return getters.quadratic
    }
  },
  modules:{
  }
})
